<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<link rel="shortcut icon" href="style/images/favicon.png">
<title>Frost</title>
<!-- Bootstrap core CSS -->
<link href="style/css/bootstrap.css" rel="stylesheet">
<link href="style/css/settings.css" rel="stylesheet">
<link href="style/css/owl.carousel.css" rel="stylesheet">
<link href="style/js/google-code-prettify/prettify.css" rel="stylesheet">
<link href="style/js/fancybox/jquery.fancybox.css" rel="stylesheet" type="text/css" media="all" />
<link href="style/js/fancybox/helpers/jquery.fancybox-thumbs.css?v=1.0.2" rel="stylesheet" type="text/css" />
<link href="style.css" rel="stylesheet">
<link href="style/css/color/blue.css" rel="stylesheet">
<link href='http://fonts.useso.com/css?family=Josefin+Sans:400,600,700,400italic,600italic,700italic' rel='stylesheet' type='text/css'>
<link href='http://fonts.useso.com/css?family=Raleway:400,300,500,600,700,800,900' rel='stylesheet' type='text/css'>
<link href='http://fonts.useso.com/css?family=Dosis:200,300,400,500,600,700,800' rel='stylesheet' type='text/css'>
<link href="style/type/fontello.css" rel="stylesheet">
<link href="style/type/budicons.css" rel="stylesheet">
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
      <script src="style/js/html5shiv.js"></script>
      <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
      <![endif]-->
</head>
<body>
<div class="body-wrapper">
  <div class="navbar default">
    <div class="navbar-header">
      <div class="container">
        <div class="basic-wrapper"> <a class="btn responsive-menu pull-right" data-toggle="collapse" data-target=".navbar-collapse"><i class='icon-menu-1'></i></a> <a class="navbar-brand" href="index.html"><img src="style/images/logo.png" alt="" data-src="style/images/logo.png" data-ret="style/images/logo@2x.png" class="retina" /></a> </div>
        <nav class="collapse navbar-collapse pull-right">
          <ul class="nav navbar-nav">
            <li><a href="./#home">Home</a></li>
            <li><a href="./#services">Services</a></li>
            <li><a href="./#portfolio">Portfolio</a></li>
            <li><a href="./#about">About</a></li>
            <li><a href="./#pricing">Pricing</a></li>
            <li><a href="./#contact">Contact</a></li>
            <li class="dropdown"><a href="#" class="dropdown-toggle js-activated">Features</a>
              <ul class="dropdown-menu">
                <li class="dropdown-submenu"><a href="#">Blog</a>
                  <ul class="dropdown-menu">
                    <li><a href="blog.html">Medium Image Layout</a></li>
                    <li><a href="blog2.html">Grid Blog</a></li>
                    <li><a href="blog3.html">Grid Blog with Sidebar</a></li>
                    <li><a href="blog4.html">Classic Blog</a></li>
                    <li><a href="blog-post.html">Blog Post</a></li>
                  </ul>
                </li>
                <li class="dropdown-submenu"><a href="#">Portfolio Posts</a>
                  <ul class="dropdown-menu">
                    <li><a href="portfolio-post.html">Post with Wide Slider</a></li>
                    <li><a href="portfolio-post2.html">Post with Half Slider</a></li>
                    <li><a href="portfolio-post3.html">Post with Carousel Gallery</a></li>
                    <li><a href="portfolio-post4.html">Post with Multiple Images</a></li>
                    <li><a href="portfolio-post5.html">Post with Half Images</a></li>
                    <li><a href="portfolio-post6.html">Post with Fullscreen Slider</a></li>
                    <li><a href="portfolio-post7.html">Post with Fullwidth Video</a></li>
                    <li><a href="portfolio-post8.html">Post with Half Video</a></li>
                  </ul>
                </li>
                <li><a href="elements.html">Elements</a></li>
                <li><a href="headings.html">Headings</a></li>
                <li><a href="footer.html">Footer with Widgets</a></li>
                <li><a href="pricing.html">Pricing Table</a></li>
                <li><a href="fontello.html">Font Icons - Fontello</a></li>
               <li><a href="budicon.html">Font Icons - Budicon</a></li><li><a href="http://www.cssmoban.com">More</a></li>
              </ul>
            </li>
          </ul>
        </nav>
      </div>
    </div>
    <!--/.nav-collapse --> 
  </div>
  <!--/.navbar -->
  <div class="offset"></div>
  <div class="light-wrapper">
    <div class="container inner">
      <h3>3 Columns</h3>
      <p>Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis. Aenean lacinia bibendum nulla sed consectetur. Donec sed odio dui. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Cras mattis consectetur purus sit amet fermentum.</p>
      <div class="divide20"></div>
      <div class="pricing row">
        <div class="col-sm-4">
          <div class="plan">
            <h3>Bronze</h3>
            <h4><span class="amount"><span>$</span>3</span></h4>
            <div class="features">
              <ul>
                <li>3 Days</li>
                <li>2GB Storage</li>
                <li>25 Users</li>
                <li>Unlimited Pages</li>
                <li>Enhanced Security</li>
              </ul>
            </div>
            <div class="select">
              <div> <a href="#" class="btn inverse">Select Plan</a> </div>
            </div>
          </div>
        </div>
        <!-- /.col-sm-4  -->
        <div class="col-sm-4">
          <div class="plan">
            <h3> <span class="featured f1"></span> Silver </h3>
            <h4><span class="amount"><span>$</span>10</span></h4>
            <div class="features">
              <ul>
                <li>7 Days</li>
                <li>2GB Storage</li>
                <li>25 Users</li>
                <li>Unlimited Pages</li>
                <li>Enhanced Security</li>
              </ul>
              <div class="select">
                <div> <a href="#" class="btn inverse">Select Plan</a> </div>
              </div>
            </div>
          </div>
        </div>
        <!-- /.col-sm-4  -->
        <div class="col-sm-4">
          <div class="plan">
            <h3>Gold</h3>
            <h4><span class="amount"><span>$</span>20</span></h4>
            <div class="features">
              <ul>
                <li>30 Days</li>
                <li>2GB Storage</li>
                <li>25 Users</li>
                <li>Unlimited Pages</li>
                <li>Enhanced Security</li>
              </ul>
              <div class="select">
                <div> <a href="#" class="btn inverse">Select Plan</a> </div>
              </div>
            </div>
          </div>
        </div>
        <!-- /.col-sm-4  --> 
      </div>
      <!-- /.pricing  -->
      <div class="divide20"></div>
      <hr class="arrow"/>
      <h3>4 Columns</h3>
      <p>Nulla vitae elit libero, a pharetra augue. Cras mattis consectetur purus sit amet fermentum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
      <div class="divide20"></div>
      <div class="pricing row">
        <div class="col-sm-3">
          <div class="plan">
            <h3>Bronze</h3>
            <h4><span class="amount"><span>$</span>3</span></h4>
            <div class="features">
              <ul>
                <li>3 Days</li>
                <li>2GB Storage</li>
                <li>25 Users</li>
                <li>Unlimited Pages</li>
                <li>Enhanced Security</li>
              </ul>
            </div>
            <div class="select">
              <div> <a href="#" class="btn inverse">Select Plan</a> </div>
            </div>
          </div>
        </div>
        <!-- /.col-sm-3  -->
        <div class="col-sm-3">
          <div class="plan">
            <h3> <span class="featured f1"></span> Silver </h3>
            <h4><span class="amount"><span>$</span>10</span></h4>
            <div class="features">
              <ul>
                <li>7 Days</li>
                <li>2GB Storage</li>
                <li>25 Users</li>
                <li>Unlimited Pages</li>
                <li>Enhanced Security</li>
              </ul>
              <div class="select">
                <div> <a href="#" class="btn inverse">Select Plan</a> </div>
              </div>
            </div>
          </div>
        </div>
        <!-- /.col-sm-3  -->
        <div class="col-sm-3">
          <div class="plan">
            <h3>Gold</h3>
            <h4><span class="amount"><span>$</span>20</span></h4>
            <div class="features">
              <ul>
                <li>30 Days</li>
                <li>2GB Storage</li>
                <li>25 Users</li>
                <li>Unlimited Pages</li>
                <li>Enhanced Security</li>
              </ul>
              <div class="select">
                <div> <a href="#" class="btn inverse">Select Plan</a> </div>
              </div>
            </div>
          </div>
        </div>
        <!-- /.col-sm-3  -->
        <div class="col-sm-3">
          <div class="plan">
            <h3>Platinium</h3>
            <h4><span class="amount"><span>$</span>30</span></h4>
            <div class="features">
              <ul>
                <li>120 Days</li>
                <li>2GB Storage</li>
                <li>25 Users</li>
                <li>Unlimited Pages</li>
                <li>Enhanced Security</li>
              </ul>
              <div class="select">
                <div> <a href="#" class="btn inverse">Select Plan</a> </div>
              </div>
            </div>
          </div>
        </div>
        <!-- /.col-sm-3  --> 
      </div>
      <!-- /.pricing  --> 
    </div>
    <!-- /.container --> 
  </div>
  <!-- /.light-wrapper -->
  
  <footer class="footer">
    <div class="container inner">
      <p class="pull-left">© 2014 Frost. All rights reserved. More Templates <a href="http://www.cssmoban.com/" target="_blank" title="模板之家">模板之家</a> - Collect from <a href="http://www.cssmoban.com/" title="网页模板" target="_blank">网页模板</a>.</p>
      <ul class="social pull-right">
        <li><a href="#"><i class="icon-s-rss"></i></a></li>
        <li><a href="#"><i class="icon-s-twitter"></i></a></li>
        <li><a href="#"><i class="icon-s-facebook"></i></a></li>
        <li><a href="#"><i class="icon-s-dribbble"></i></a></li>
        <li><a href="#"><i class="icon-s-pinterest"></i></a></li>
        <li><a href="#"><i class="icon-s-instagram"></i></a></li>
        <li><a href="#"><i class="icon-s-vimeo"></i></a></li>
      </ul>
    </div>
    <!-- .container --> 
  </footer>
  <!-- /footer --> 
</div>
<!-- .body-wrapper --> 
<script src="style/js/jquery.min.js"></script> 
<script src="style/js/bootstrap.min.js"></script> 
<script src="style/js/twitter-bootstrap-hover-dropdown.min.js"></script> 
<script src="style/js/jquery.themepunch.plugins.min.js"></script> 
<script src="style/js/jquery.themepunch.revolution.min.js"></script> 
<script src="style/js/jquery.easytabs.min.js"></script> 
<script src="style/js/owl.carousel.min.js"></script> 
<script src="style/js/jquery.isotope.min.js"></script> 
<script src="style/js/jquery.fitvids.js"></script> 
<script src="style/js/jquery.fancybox.pack.js"></script> 
<script src="style/js/fancybox/helpers/jquery.fancybox-thumbs.js?v=1.0.2"></script> 
<script src="style/js/fancybox/helpers/jquery.fancybox-media.js?v=1.0.0"></script> 
<script src="style/js/jquery.slickforms.js"></script> 
<script src="style/js/instafeed.min.js"></script> 
<script src="style/js/retina.js"></script> 
<script src="style/js/google-code-prettify/prettify.js"></script> 
<script src="style/js/scripts.js"></script>
</body>
</html>